
<div class="panel panel-default panel-intro">
    <div class="panel-heading">
        <div class="panel-lead"></div>
        <ul class="nav nav-tabs">
            <li class="active"><a href="#first" data-toggle="tab">视频列表</a></li>
            <li><a href="#second" data-toggle="tab">视频生成</a></li>
            <li><a href="#third" data-toggle="tab">视频合成记录</a></li>
            <li><a href="#upload" data-toggle="tab">视频上传</a></li>


        </ul>
    </div>
    <div class="panel-body">
        <div id="myTabContent" class="tab-content">

            <div class="tab-pane fade active in" id="first">
                <div id="toolbar1" class="toolbar">
                    {:build_toolbar('refresh')}
                </div>
                <table id="table1" class="table table-striped table-bordered table-hover" width="100%">
                </table>
            </div>

            <div class="tab-pane fade" id="second">
                <div class="tab-content">
                    <div class="tab-pane active" id="info19">
                        <div class="well">
                            <h3>视频合成</h3>
                            <h4>视频AI合成基于素材库进行生成</h4>
                        </div>
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <strong>
                                    使用须知
                                </strong>
                            </div>
                            <div class="panel-body">
                                <span style="color: #b34343;">{$textletter}</span>：<span style="color:red">{$leftTimes}</span> 个。
                                生成视频时长不能大于1分钟。提升完播率，<span style="color:red">建议在15秒，则会有更多抖音流量推送</span>
                            </div>
                        </div>
                        <!-- 内容 -->

                        <form class="form-horizontal form-ajax" role="form" data-toggle="validator" method="POST" id="form"  action="aivideo/submitai">

                            <div class="panel panel-default">
                                <div class="panel-heading">
                                    <strong>
                                        选择视频素材<span style="color: red">（系统会在每个场景中随机选择出一个视频）</span>
                                    </strong>
                                </div>
                                <div class="panel-body">
                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-2">场景1:</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <div class="input-group">
                                                <input id="c-video_list_one"  placeholder="必填*"  data-rule="required" class="form-control" size="50" name="video_list_one" type="text" value="">
                                                <div class="input-group-addon no-border no-padding">
                                                    <span><button type="button" id="plupload-video_list_one" class="btn btn-danger faupload" data-input-id="c-video_list_one" data-mimetype="video/mp4,video/x-flv" data-multiple="true" data-preview-id="p-video_list_one" data-timeout="600000"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                                    <span><button type="button" id="fachoose-video_list_one" class="btn btn-primary fachoose" data-input-id="c-video_list_one" data-mimetype="video/mp4,video/x-flv" data-multiple="true"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                                                </div>
                                                <span class="msg-box n-right" for="c-video_list_one"></span>
                                            </div>
                                            <ul class="row list-inline faupload-preview" id="p-video_list_one" data-template="desctpl"></ul>
                                        </div>
                                    </div>
                                </div>




                                <div class="panel-body">
                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-2">场景2:</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <div class="input-group">
                                                <input id="c-video_list_two"  placeholder="必填*"  data-rule="required" class="form-control" size="50" name="video_list_two" type="text" value="">
                                                <div class="input-group-addon no-border no-padding">
                                                    <span><button type="button" id="plupload-video_list_two" class="btn btn-danger faupload" data-input-id="c-video_list_two" data-mimetype="video/mp4,video/x-flv" data-multiple="true" data-preview-id="p-video_list_two" data-timeout="600000"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                                    <span><button type="button" id="fachoose-video_list_two" class="btn btn-primary fachoose" data-input-id="c-video_list_two" data-mimetype="video/mp4,video/x-flv" data-multiple="true"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                                                </div>
                                                <span class="msg-box n-right" for="c-video_list_two"></span>
                                            </div>
                                            <ul class="row list-inline faupload-preview" id="p-video_list_two" data-template="desctpl"></ul>
                                        </div>
                                    </div>
                                </div>



                                <div class="panel-body">
                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-2">场景3:</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <div class="input-group">
                                                <input id="c-video_list_three" placeholder="必填*" data-rule="required" class="form-control" size="50" name="video_list_three" type="text" value="">
                                                <div class="input-group-addon no-border no-padding">
                                                    <span><button type="button" id="plupload-video_list_three" class="btn btn-danger faupload" data-input-id="c-video_list_three" data-mimetype="video/mp4,video/x-flv" data-multiple="true" data-preview-id="p-video_list_three" data-timeout="600000"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                                    <span><button type="button" id="fachoose-video_list_three" class="btn btn-primary fachoose" data-input-id="c-video_list_three" data-mimetype="video/mp4,video/x-flv" data-multiple="true"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                                                </div>
                                                <span class="msg-box n-right" for="c-video_list_three"></span>
                                            </div>
                                            <ul class="row list-inline faupload-preview" id="p-video_list_three" data-template="desctpl"></ul>
                                        </div>
                                    </div>
                                </div>





                                <div class="panel-body">
                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-2">场景4:</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <div class="input-group">
                                                <input id="c-video_list_four" placeholder="选填" class="form-control" size="50" name="video_list_four" type="text" value="">
                                                <div class="input-group-addon no-border no-padding">
                                                    <span><button type="button" id="plupload-video_list_four" class="btn btn-danger faupload" data-input-id="c-video_list_four" data-mimetype="video/mp4,video/x-flv" data-multiple="true" data-preview-id="p-video_list_four" data-timeout="600000"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                                    <span><button type="button" id="fachoose-video_list_four" class="btn btn-primary fachoose" data-input-id="c-video_list_four" data-mimetype="video/mp4,video/x-flv" data-multiple="true"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                                                </div>
                                                <span class="msg-box n-right" for="c-video_list_four"></span>
                                            </div>
                                            <ul class="row list-inline faupload-preview" id="p-video_list_four" data-template="desctpl"></ul>
                                        </div>
                                    </div>
                                </div>




                                <div class="panel-body">
                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-2">场景5:</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <div class="input-group">
                                                <input id="c-video_list_five" placeholder="选填" class="form-control" size="50" name="video_list_five" type="text" value="">
                                                <div class="input-group-addon no-border no-padding">
                                                    <span><button type="button" id="plupload-video_list_five" class="btn btn-danger faupload" data-input-id="c-video_list_five" data-mimetype="video/mp4,video/x-flv" data-multiple="true" data-preview-id="p-video_list_five" data-timeout="600000"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                                    <span><button type="button" id="fachoose-video_list_five" class="btn btn-primary fachoose" data-input-id="c-video_list_five" data-mimetype="video/mp4,video/x-flv" data-multiple="true"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                                                </div>
                                                <span class="msg-box n-right" for="c-video_list_five"></span>
                                            </div>
                                            <ul class="row list-inline faupload-preview" id="p-video_list_five" data-template="desctpl"></ul>
                                        </div>
                                    </div>
                                </div>


                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-2">使用场景数</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <div class="col-xs-12 col-sm-2">
                                                <select  id="c-paytype" data-rule="required" class="form-control selectpicker" name="singleVideo_nums">
                                                    <option value="3"   >3</option>
                                                    <option value="4"   >4</option>
                                                    <option value="5"   >5</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>


                                <script type="text/html" id="desctpl">
                                    <li class="col-xs-6">
                                        <a href="<%=fullurl%>" data-url="<%=url%>" style="width:100%;height: 200px">
                                            <video src="<%=fullurl%>" controls="controls"  style="width:100%;height: 200px"></video>
                                        </a>
                                        <a href="javascript:;" class="btn btn-danger btn-xs btn-trash"><i class="fa fa-trash"></i></a>
                                    </li>
                                </script>


                            </div>


                            <div class="panel panel-default">
                                <div class="panel-heading">
                                    <strong>
                                        选择音频素材
                                    </strong>
                                </div>
                                <div class="panel-body">
                                    <div class="panel-body">
                                        <div class="form-group">
                                            <label class="control-label col-xs-12 col-sm-2">音频素材列表:</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <div class="input-group">
                                                    <input id="c-audio_list" data-rule="required" class="form-control" size="50" name="audio_list" type="text" value="">
                                                    <div class="input-group-addon no-border no-padding">
                                                        <span><button type="button" id="plupload-audio_list" class="btn btn-danger faupload hidden" data-input-id="c-audio_list" data-mimetype="wav/wav" data-multiple="true" data-preview-id="p-audio_list" data-timeout="600000"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                                        <span><button type="button" id="fachoose-audio_list" class="btn btn-primary fachoose" data-input-id="c-audio_list" data-mimetype="wav/wav" data-multiple="true"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                                                    </div>
                                                    <span class="msg-box n-right" for="c-audio_list"></span>
                                                </div>
                                                <ul class="row list-inline faupload-preview" id="p-audio_list" data-template="desctp2"></ul>
                                                <script type="text/html" id="desctp2">
                                                    <li class="col-xs-4">

                                                            <audio src="<%=fullurl%>" controls="controls"  style="width:100%;height: 50px"></audio>

                                                        <a href="javascript:;" class="btn btn-danger btn-xs btn-trash"><i class="fa fa-trash"></i></a>
                                                    </li>
                                                </script>
                                            </div>
                                        </div>
                                    </div>
                                </div>


                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-2">使用音频素材数</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <div class="col-xs-12 col-sm-2">
                                                <select  id="c-" data-rule="required" class="form-control selectpicker" name="singleAudio_nums">
                                                    <option value="1"   >1</option>
                                                    <option value="2"   >2</option>
                                                    <option value="3"   >3</option>
                                                    <option value="4"   >4</option>
                                                    <option value="5"   >5</option>
                                                    <option value="6"   >6</option>
                                                    <option value="7"   >7</option>
                                                    <option value="8"   >8</option>
                                                    <option value="9"   >9</option>
                                                    <option value="10"   >10</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>

                                
                            </div>


                            <div class="panel panel-default">
                                <div class="panel-heading">
                                    <strong>
                                        选择背景音乐素材
                                    </strong>
                                </div>
                                <div class="panel-body">
                                    <div class="panel-body">
                                        <div class="form-group">
                                            <label class="control-label col-xs-12 col-sm-2">背景音乐素材列表:</label>
                                            <div class="col-xs-12 col-sm-8">
                                                <div class="input-group">
                                                    <input id="c-back_list" data-rule="required" class="form-control" size="50" name="back_list" type="text" value="">
                                                    <div class="input-group-addon no-border no-padding">
                                                        <span><button type="button" id="plupload-back_list" class="btn btn-danger faupload" data-input-id="c-back_list" data-mimetype="audio/*" data-multiple="false" data-preview-id="p-back_list" data-timeout="600000"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                                        <span><button type="button" id="fachoose-back_list" class="btn btn-primary fachoose" data-input-id="c-back_list" data-mimetype="audio/*" data-multiple="false"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                                                    </div>
                                                    <span class="msg-box n-right" for="c-back_list"></span>
                                                </div>
                                                <ul class="row list-inline faupload-preview" id="p-back_list" data-template="desctp3"></ul>
                                                <script type="text/html" id="desctp3">
                                                    <li class="col-xs-4">
                                                        <a href="<%=fullurl%>" data-url="<%=url%>" style="width:100%;height: 50px">
                                                            <audio src="<%=fullurl%>" controls="controls"  style="width:100%;height: 50px"></audio>
                                                        </a>
                                                        <a href="javascript:;" class="btn btn-danger btn-xs btn-trash"><i class="fa fa-trash"></i></a>
                                                    </li>
                                                </script>

                                            </div>
                                        </div>
                                    </div>




                                </div>
                            </div>

                            <div class="panel panel-default">
                                <div class="panel-heading">
                                    <strong>
                                        选择活动
                                    </strong>
                                </div>
                                <div class="panel-body">
                                    <div class="panel-body">
                                        <div class="form-group">
                                            <label class="control-label col-xs-12 col-sm-2">选择活动:</label>
                                            <div class="col-xs-12 col-sm-4">
                                                <input id="c-activity_id" data-rule="required" data-source="activity/index" data-field="title" class="form-control selectpage" name="activity_id" type="text" value="">

                                            </div>
                                        </div>
                                    </div>




                                </div>
                            </div>



                            <div class="panel panel-default">
                                <div class="panel-heading">
                                    <strong>
                                        视频生成设置参数
                                    </strong>
                                </div>
                                <div class="panel-body">






                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-2">预生成视频数</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <input id="c-video_nums"   name="video_nums" type="number" data-rule="required" placeholder="建议10个，不得大于50">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-2">视频名称</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <input id="c-name"   name="name" type="text" data-rule="required" placeholder="请填写视频名称" maxlength="50">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-2">AI视频低于再预生成</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <input id="c-aivideo_nums"   name="Aivideo_nums" type="number"  placeholder="建议10个">
                                        </div>
                                    </div>


                                    <div class="form-group">
                                        <label class="control-label col-xs-12 col-sm-2">视频合成最大数量</label>
                                        <div class="col-xs-12 col-sm-8">
                                            <input id="c-aivideo_nums_max"   name="Aivideo_nums_max" type="number" data-rule="required"  placeholder="大于该数量不再自动合成视频">
                                        </div>
                                    </div>

                                    <div>
                                        <div>   预计生成视频时长: 15S-20S        </div>
                                        <div>   .最短视频时长=单个视频使用素材数* 最短视频素材时长 </div>
                                        <div>   最长视频时长=单个视频使用素材数 *最长视频素材时长 </div>
                                    </div>
                                </div>

                                <button class="btn btn-success submit" id="joinfiles" style="margin: 20px;">提交任务</button>
                            </div>

                        </form>




                    </div>

                </div>
            </div>

            <div class="tab-pane fade" id="third">
                <div id="toolbar2" class="toolbar">
                    {:build_toolbar('refresh')}
                </div>
                <table id="table2" class="table table-striped table-bordered table-hover" width="100%">
                </table>
            </div>

            <!--视频上传-->
            <div class="tab-pane fade" id="upload">
                <div class="tab-content">
                    <div class="tab-pane active">
                        <div class="well">
                            <h3>视频上传</h3>
                            <div>直接上传本地的视频。</div>
                            <div style="color:red;">视频大小一般小于50m，可以降低网关超时造成的失败。</div>
                            <div>带品牌logo或品牌水印的视频，会命中审核逻辑，有比较大的概率导致分享视频推荐降权处理/分享视频下架处理/分享账号被封禁处理。强烈建议第三方应用自行处理好分享内容中的不合规水印。</div>
                        </div>
                        <form class="form-horizontal form-ajax" role="form" data-toggle="validator" method="POST" action="aivideo/upload">
                            <div class="panel panel-default">
                                <div class="panel-heading">
                                    <strong>
                                        填写信息
                                    </strong>
                                </div>
                                <div class="panel-body">
                                    <div class="panel-body">
                                        <div class="form-group">
                                            <label class="control-label col-xs-12 col-sm-2">选择活动:</label>
                                            <div class="col-xs-12 col-sm-4">
                                                <input data-rule="required" data-source="activity/index" data-field="title" class="form-control selectpage" name="activity_id" type="text">
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="control-label col-xs-12 col-sm-2">选择视频:</label>
                                            <div class="col-xs-12 col-sm-4">
                                                <div class="input-group">
                                                    <input id="upload_video" data-rule="required" class="form-control" size="50" name="video" type="text">
                                                    <div class="input-group-addon no-border no-padding">
                                                        <span><button type="button" id="upload_video_list" class="btn btn-danger faupload" data-input-id="upload_video" data-mimetype="video/mp4" data-multiple="false" data-multipart='{"storage":"local","save_db":"no"}' data-preview-id="preview_video" data-timeout="600000"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                                    </div>
                                                    <span class="msg-box n-right" for="upload_video"></span>
                                                </div>
                                                <ul class="row list-inline faupload-preview" id="preview_video" data-template="desctpl"></ul>
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="control-label col-xs-12 col-sm-2">视频名称:</label>
                                            <div class="col-xs-12 col-sm-4">
                                                <input data-rule="required" class="form-control" name="title" type="text" maxlength="50">
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <label class="control-label col-xs-12 col-sm-2">
                                                <button class="btn btn-success submit">提交</button>
                                            </label>
                                            <div class="col-xs-12 col-sm-4"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>

        </div>
    </div>
</div>














